<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>商品详情</title>
    <link rel="stylesheet" href="../Css/detail.css">
    <link rel="stylesheet" href="../Css/header.css">
    <link rel="stylesheet" href="../Css/footer.css">
    <link rel="stylesheet" href="../libs/font_2bcxo7eo5gt/iconfont.css">
    <link rel="icon" href="https://store.res.meizu.com/layout/img/favicon-2e71785f44.ico" type="image/x-icon">
    <script src="../libs/requirejs/require.js" data-main="/js/detail"></script>
</head>

<body>
    <header></header>
    <section>
        <div class="hBox"></div>
    </section>
    <footer></footer>
    <script type="text/html" id="dtailList">
        <div class="detail_hBox" data-id="{{prod.id}}">
            <div class="head">
                <div>魅族 Note9</div>
                <ul>
                    <li>
                        <a href="#" onclick="return false">概述</a>
                    </li>
                    <li>
                        <a href="#" onclick="return false">参数</a>
                    </li>
                    <li>
                        <a href="#" onclick="return false">常见问题</a>
                    </li>
                </ul>
            </div>
            <div class="message">
                <div class="message_Left">
                    <ul>

                        <li><img src="{{prod.photos[0].url}}" alt="" class="prod-img"></li>
                    </ul>
                    <ul>
                        {{each prod.photos photo}}
                        <li><img src="{{photo.url}}" alt=""></li> {{/each}}
                    </ul>
                    <div>
                        <a href="#" onclick="return false"><i class="iconfont icon-Collection"></i><span>收藏</span></a>
                        <a href="#" onclick="return false"><i class="iconfont icon-duibi"></i><span>对比</span></a>

                    </div>
                </div>
                <div class="message_Right">
                    <div class="message_Righthead">
                        <h1>魅族 Note9</h1>
                        <p class="prod-title">{{prod.title}}</p>
                    </div>
                    <div class="messagePrice">
                        <div class="sell">
                            <p>￥</p>
                            <span class="prod-price">{{prod.price}}</span>
                        </div>
                        <div class="discounts">
                            <span>折扣价</span>
                            <span>{{prod.originPrice}}</span>
                            <span><a>立即加购 ></a></span>
                        </div>
                    </div>
                    <div class="messageMiddle">
                        <ul>
                            <li>支<span></span><span></span>持</li>
                            <li><span class="iconfont icon-check-circle"></span>{{prod.couponStatus}}</li>
                            <li><span class="iconfont icon-check-circle"></span>{{prod.expireMsg}}</li>
                            <li><span class="iconfont icon-check-circle"></span>{{prod.couponValue}}</li>
                        </ul>
                        <div><span>配送服务</span><span>四川省</span><span>成都市</span><span></span></div>
                        <div><span>本商品由 魅族 负责发货并提供售后服务</span><span><i class="iconfont icon-kefu"></i>商城客服</span></div>
                    </div>
                    <div class="messageDown">
                        <div>
                            <span>型&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;号</span>
                            <ul>
                                <li><input type="button" value="魅族 Note9"></li>
                                <li><input type="button" value="魅族 16s"></li>
                                <li><input type="button" value="魅族 16th"></li>
                                <li><input type="button" value="魅族 16th Plus"></li>
                                <li><input type="button" value="魅族 16 X"></li>
                                <li><input type="button" value="魅族 X8"></li>
                            </ul>
                        </div>
                        <div>
                            <span>网络类型</span>
                            <ul>
                                <li><input type="button" value="全网通公开版"></li>
                            </ul>
                        </div>
                        <div>
                            <span>颜色分类</span>
                            <ul>
                                <li><input type="button" value="魅族 Note9"></li>
                                <li><input type="button" value="魅族 16s"></li>
                                <li><input type="button" value="魅族 X8"></li>
                            </ul>
                        </div>
                        <div>
                            <span>内存容量</span>
                            <ul>
                                <li><input type="button" value="魅族 Note9"></li>
                                <li><input type="button" value="魅族 16 X"></li>
                                <li><input type="button" value="魅族 X8"></li>
                            </ul>
                        </div>

                        <div>
                            <span>选择套餐</span>
                            <ul>
                                <li><input type="button" value="魅族 Note9"></li>
                                <li><input type="button" value="魅族 16s"></li>
                                <li><input type="button" value="魅族 X8"></li>
                            </ul>
                        </div>
                        <div>
                            <span>花呗分期</span>
                            <ul>
                                <li><input type="button" value="魅族 Note9"></li>
                                <li><input type="button" value="魅族 16 X"></li>
                                <li><input type="button" value="魅族 X8"></li>
                            </ul>
                        </div>
                        <div>
                            <span>数&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;量</span>
                            <span><a href="">-</a><input type="text" value="1"><a href="">+</a></span>
                        </div>
                        <div>
                            <input type="button" value="立即购买">
                            <form class="get-to-cart">
                                <input type="submit" value="加入购物车">
                            </form>
                        </div>
                    </div>
                </div>
            </div>
            <div class="proDetail">
                <span>商品详情</span>
                <div class="proPirture">
                    {{each prod.descContentList content}} {{if content.photo}}
                    <div><img src="{{content.photo.url}}" alt=""></div>
                    {{/if}} {{/each}}
                </div>
            </div>
        </div>
    </script>

</body>

</html>